window.onload = function() {
var myname = "付坤";
var complate = "众智科技";
console.log(complate + '_' + myname);
var veImg = document.getElementById("veImg");
var ve = document.getElementById('video');
var img = document.getElementById('img');
    veImg.onclick = function(){
    veImg.style.display = "none";
    img.style.display = "none";
    ve.style.display = "block";
    ve.play();
}
// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图
function my$(id) {
    return document.getElementById(id);
    }
    
    //获取各元素，方便操作
    var box=my$("box");
    var inner=box.children[0];
    var ulObj=inner.children[0];
    var list=ulObj.children;
    var olObj=inner.children[1];
    var arr=my$("arr");
    var imgWidth=inner.offsetWidth;
    var right=my$("right");
    var pic=0;
    //根据li个数，创建小按钮
    for(var i=0;i<list.length;i++){
        var liObj=document.createElement("li");
    
        olObj.appendChild(liObj);
        liObj.setAttribute("index",i);
    
        //为按钮注册mouseover事件
        liObj.onmouseover=function () {
            //先清除所有按钮的样式
    
            for (var j=0;j<olObj.children.length;j++){
                olObj.children[j].removeAttribute("class");
            }
            this.className="current";
            pic=this.getAttribute("index");
            animate(ulObj,-pic*imgWidth);
        }
    }
    //设置ol中第一个li有背景颜色
    olObj.children[0].className = "current";
    //克隆一个ul中第一个li,加入到ul中的最后=====克隆
    ulObj.appendChild(ulObj.children[0].cloneNode(true));
    
    var timeId=setInterval(onmouseclickHandle ,3000);
    //左右焦点实现点击切换图片功能
    box.onmouseover=function () {
        arr.style.display="block";
        clearInterval(timeId);
    };
    box.onmouseout=function () {
        arr.style.display="none";
        timeId=setInterval(onmouseclickHandle ,3000);
    };
    
    right.onclick=onmouseclickHandle;
    function onmouseclickHandle() {
        if (pic == list.length - 1) {
            //如何从第6个图,跳转到第一个图
            pic = 0;//先设置pic=0
            ulObj.style.left = 0 + "px";//把ul的位置还原成开始的默认位置
        }
        pic++;//立刻设置pic加1,那么此时用户就会看到第二个图片了
        animate(ulObj, -pic * imgWidth);
        if (pic == list.length - 1) {
            //第五个按钮颜色干掉
            olObj.children[olObj.children.length - 1].className = "";
            //第一个按钮颜色设置上
            olObj.children[0].className = "current";
        } else {
            //干掉所有的小按钮的背景颜色
            for (var i = 0; i < olObj.children.length; i++) {
                olObj.children[i].removeAttribute("class");
            }
            olObj.children[pic].className = "current";
        }
    }
    left.onclick=function () {
        if (pic==0){
            pic=list.length-1;
            ulObj.style.left=-pic*imgWidth+"px";
        }
        pic--;
        animate(ulObj,-pic*imgWidth);
        for (var i = 0; i < olObj.children.length; i++) {
            olObj.children[i].removeAttribute("class");
        }
        //当前的pic索引对应的按钮设置颜色
        olObj.children[pic].className = "current";
    };
    
    //设置任意的一个元素,移动到指定的目标位置
    function animate(element, target) {
        clearInterval(element.timeId);
        //定时器的id值存储到对象的一个属性中
        element.timeId = setInterval(function () {
            //获取元素的当前的位置,数字类型
            var current = element.offsetLeft;
            //每次移动的距离
            var step = 10;
            step = current < target ? step : -step;
            //当前移动到位置
            current += step;
            if (Math.abs(current - target) > Math.abs(step)) {
                element.style.left = current + "px";
            } else {
                //清理定时器
                clearInterval(element.timeId);
                //直接到达目标
                element.style.left = target + "px";
            }
        }, 10);
    }
// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图// 轮播图
//星空背景 //星空背景 //星空背景 //星空背景 //星空背景 //星空背景 
var canvas= document.getElementById('canvas'),
ctx = canvas.getContext('2d'),
w = canvas.width = window.innerWidth,
h = canvas.height = window.innerHeight,

hue = 217,
stars = [],
count = 0,
maxStars = 1300;//星星数量

var canvas2= document.createElement('canvas'),
ctx2= canvas2.getContext('2d');
canvas2.width= 100;
canvas2.height= 100;

var half =canvas2.width / 2,
gradient2= ctx2.createRadialGradient(half, half, 0, half, half, half);
gradient2.addColorStop(0.025, '#CCC');
gradient2.addColorStop(0.1, 'hsl(' + hue + ', 61%, 33%)');
gradient2.addColorStop(0.25, 'hsl(' + hue + ', 64%, 6%)');
gradient2.addColorStop(1, 'transparent');

ctx2.fillStyle= gradient2;
ctx2.beginPath();
ctx2.arc(half,half, half, 0, Math.PI * 2);
ctx2.fill();

//End cache

function random(min, max) {
if (arguments.length < 2) {
max = min;
min = 0;
}

if (min > max){
var hold = max;
max = min;
min = hold;
}

return Math.floor(Math.random() * (max -min + 1)) +min;
}

function maxOrbit(x, y) {
var max = Math.max(x, y),
diameter = Math.round(Math.sqrt(max * max + max * max));
return diameter/ 2;
//星星移动范围，值越大范围越小，
}

var Star = function () {

this.orbitRadius =random(maxOrbit(w, h));
this.radius = random(60, this.orbitRadius)/ 8;
//星星大小
this.orbitX = w / 2;
this.orbitY = h / 2;
this.timePassed =random(0, maxStars);
this.speed = random(this.orbitRadius)/ 50000;
//星星移动速度
this.alpha = random(2, 10) / 10;

count++;
stars[count] = this;
}

Star.prototype.draw= function () {
var x = Math.sin(this.timePassed)* this.orbitRadius+ this.orbitX,
y = Math.cos(this.timePassed) * this.orbitRadius + this.orbitY,
twinkle = random(10);

if (twinkle=== 1 && this.alpha > 0) {
this.alpha -= 0.05;
} else if (twinkle=== 2 && this.alpha < 1) {
this.alpha += 0.05;
}

ctx.globalAlpha = this.alpha;
ctx.drawImage(canvas2, x - this.radius / 2, y - this.radius / 2, this.radius, this.radius);
this.timePassed+= this.speed;
}

for (var i = 0; i < maxStars;i++) {
new Star();
}

function animation() {
ctx.globalCompositeOperation = 'source-over';
ctx.globalAlpha = 0.5; //尾巴
ctx.fillStyle = 'hsla(' + hue + ', 64%, 6%, 2)';
ctx.fillRect(0, 0, w, h)

ctx.globalCompositeOperation = 'lighter';
for (var i = 1, l = stars.length;i < l; i++) {
stars[i].draw();
canvas2.style.cssText = "display:none";
};

window.requestAnimationFrame(animation);
}


animation();
//星空背景 //星空背景 //星空背景 //星空背景 //星空背景 //星空背景 


























}